<template>
  <div>
    <!-- 信息弹窗 -->
    <el-dialog
      width="500px"
      custom-class="customWidth"
      center
      :before-close="closeDialog"
      title="门锁信息"
      :close-on-click-modal="false"
      :visible.sync="eidtDialogFormVisible"
    >
      <el-form
        :model="editdataForm"
        :rules="eidtataRule"
        ref="editdataForm"
        @keyup.enter.native="addataFormSubmit()"
        label-width="80px"
        :disabled="!isauth('lock_edit')"
      >
        <el-form-item label="设备名称" prop="terminalName">
          <el-col :span="15">
            <el-input v-model="editdataForm.terminalName" size="mini" disabled></el-input>
          </el-col>
        </el-form-item>
        <el-form-item label="设备编号" prop="terminalCode">
          <el-col :span="15">
            <el-input v-model="editdataForm.terminalCode" size="mini" disabled></el-input>
          </el-col>
        </el-form-item>
        <el-form-item label="设备型号" prop="devicemodel">
          <el-col :span="15">
            <el-select
              v-model="editdataForm.devicemodel"
              placeholder="请选择"
              style="width: 100%"
              size="mini"
              disabled
            >
              <el-option
                v-for="item in terminaloption"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-col>
        </el-form-item>
        <el-form-item label="名单格式" prop="nameListType">
          <el-col :span="15">
            <el-select
              clearable
              v-model="editdataForm.nameListType"
              placeholder="使用名单格式"
              size="mini"
              style="width: 100%"
              disabled
            >
              <el-option
                v-for="item in nameListOption"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-col>
        </el-form-item>
        <el-form-item label="序列号" prop="mac" v-if="editdataForm.devicemodel == 43">
          <el-col :span="15">
            <el-input v-model="editdataForm.mac" size="mini"></el-input>
          </el-col>
        </el-form-item>
        <el-form-item label="是否启用">
          <el-col :span="15">
            <el-checkbox v-model="editdataForm.deviceisuse"></el-checkbox>
          </el-col>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer" v-if="isauth('lock_edit')">
        <el-button @click="editvisible()">取消</el-button>
        <el-button type="primary" @click="editdataFormSubmit()">确定</el-button>
      </span>
    </el-dialog>
    <!-- 中继修改弹窗 -->
    <el-dialog
      width="500px"
      custom-class="customWidth"
      center
      :before-close="repeatercloseDialog"
      title="修改路由信息"
      :close-on-click-modal="false"
      :visible.sync="repeaterDialogFormVisible"
    >
      <el-form
        :model="repeaterdataForm"
        :rules="repeaterdataFormRule"
        ref="repeaterdataForm"
        label-width="100px"
        :disabled="!isauth('lock_edit')"
      >
        <el-form-item label="第一跳中继" prop="repeater1">
          <el-col :span="15">
            <el-select
              v-model="repeaterdataForm.repeater1"
              placeholder="请选择"
              style="width: 100%"
              size="mini"
              clearable
              @change="repeaterslect"
            >
              <el-option
                v-for="item in repeateroption"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-col>
        </el-form-item>
        <!-- <el-form-item label="第二条中继" prop="repeater2">
          <el-col :span="15">
            <el-select
              v-model="repeaterdataForm.repeater2"
              placeholder="请选择"
              style="width: 100%"
              size="mini"
              clearable
              @change="repeaterslect2"
            >
              <el-option
                v-for="item in repeateroption"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-col>
        </el-form-item>
        <el-form-item label="第三条中继" prop="repeater3">
          <el-col :span="15">
            <el-select
              v-model="repeaterdataForm.repeater3"
              placeholder="请选择"
              style="width: 100%"
              size="mini"
              clearable
              @change="repeaterslect3"
            >
              <el-option
                v-for="item in repeateroption"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-col>
        </el-form-item>
        <el-form-item label="第四条中继" prop="repeater4">
          <el-col :span="15">
            <el-select
              v-model="repeaterdataForm.repeater4"
              placeholder="请选择"
              style="width: 100%"
              size="mini"
              clearable
              @change="repeaterslect4"
            >
              <el-option
                v-for="item in repeateroption"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-col>
        </el-form-item>-->
      </el-form>
      <span slot="footer" class="dialog-footer" v-if="isauth('lock_edit')">
        <el-button @click="repeatervisible()">取消</el-button>
        <el-button type="primary" @click="repeaterdataFormSubmit()">确定</el-button>
      </span>
    </el-dialog>
    <!-- 参数模板修改弹窗 -->
    <el-dialog
      width="500px"
      custom-class="customWidth"
      center
      :before-close="parametercloseDialog"
      title="修改参数模板"
      :close-on-click-modal="false"
      :visible.sync="parameterDialogFormVisible"
    >
      <el-form
        :model="parameterdataForm"
        :rules="parameterRule"
        ref="parameterdataForm"
        label-width="80px"
        :disabled="!isauth('lock_edit')"
      >
        <el-form-item label="模板" prop="template">
          <el-col :span="15">
            <el-select
              v-model="parameterdataForm.template"
              placeholder="请选择"
              style="width: 100%"
              size="mini"
            >
              <el-option
                v-for="item in templateoption"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-col>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer" v-if="isauth('lock_edit')">
        <el-button @click="parametervisible()">取消</el-button>
        <el-button type="primary" @click="parameterdataFormSubmit()">确定</el-button>
      </span>
    </el-dialog>

    <!-- 人员授权、延长授权时间 -->
    <div class="logTable">
      <el-dialog
        width="1000px"
        custom-class="customWidth"
        center
        :before-close="personnelcloseDialog"
        title="人员授权"
        :close-on-click-modal="false"
        :visible.sync="personnelFormVisible"
      >
        <operatin-income-summary-of-consumption
          v-if="operatinincomesummaryofconsmptionVisible"
          ref="operatinincomesummaryofconsumption"
          :datetime="datetime"
          :unitGuid="changeschoolid"
          :consumptionpoint="consumptionpoint"
          :radio="radio"
          :roomGuid="roomGuid"
        ></operatin-income-summary-of-consumption>
        <span slot="footer" class="dialog-footer" v-if="isauth('lock_edit')">
          <el-button @click="personnelvisible()">取消</el-button>
          <el-button type="primary" @click="baocun">保存</el-button>
        </span>
      </el-dialog>
    <!-- 房间出入记录 -->
    <el-dialog
      width="1000px"
      custom-class="customWidth"
      center
      :before-close="recordscloseDialog"
      :title="recordsTitle"
      :close-on-click-modal="false"
      :visible.sync="recordsFormVisible"
    >
      <records-details v-if="recordsdetailsVisible" ref="recordsdetails" :roomGuid="roomGuid"></records-details>
    </el-dialog>

    <!-- 时效密码 -->
    <el-dialog
      width="1000px"
      custom-class="customWidth"
      center
      :before-close="passcloseDialog"
      :title="passTitle"
      :close-on-click-modal="false"
      :visible.sync="passFormVisible"
    >
      <password-details
        v-if="passdetailsVisible"
        ref="passdetailsRef"
        :datetime="datetime"
        :unitGuid="changeschoolid"
        :consumptionpoint="consumptionpoint"
        :radio="radio"
        :roomGuid="roomGuid"
        :terminalGuid="passterdataForm.terminalGuid"
      ></password-details>
      <!-- v-if="isauth('lock_edit')" -->
      <span slot="footer" class="dialog-footer">
        <el-button @click="passvisible()">取消</el-button>
        <el-button type="primary" @click="passbaocun">保存</el-button>
      </span>
    </el-dialog>
    </div>

  </div>
</template>

<script>
import OperatinIncomeSummaryOfConsumption from './operatin-personnel-setting'
import RecordsDetails from './records-details'
import PasswordDetails from './password-details'

export default {
  data() {
    return {
      // 时效密码
      passTitle: '时效密码',
      passFormVisible: false,
      passdetailsVisible: true,
      passterdataForm: {
        terminalGuid: ''
      },
      operatinincomesummaryofconsmptionVisible: true,
      // 通行记录
      recordsTitle: '房间通行记录',
      recordsdetailsVisible: true,
      datetime: [],
      consumptionpoint: '',
      // 房间id
      roomGuid: '',
      radio: 0,
      // 弹窗显示数据
      eidtDialogFormVisible: false,
      repeaterDialogFormVisible: false,
      parameterDialogFormVisible: false,
      personnelFormVisible: false,
      recordsFormVisible: false,
      terminaloption: [],
      buildingGuid: '',
      unitGuid: '',
      // 使用格式
      nameListOption: [],
      editdataForm: {
        terminalCode: '',
        terminalName: '',
        devicemodel: '',
        deviceisuse: false,
        terminalGuid: '',
        nameListType: '',
        mac: ''
      },
      eidtataRule: {},

      //中继
      repeateroption: [],
      repeaterdataForm: {
        repeater1: '',
        repeater2: '',
        repeater3: '',
        repeater4: '',
        controllerGuid: ''
      },
      repeaterdataFormRule: {},

      //模板
      parameterdataForm: {
        template: ''
      },
      templateoption: [],
      parameterRule: {},

      roomGuidList: []
    }
  },
  props: ['buttonindex'],
  computed: {
    changeschoolid: {
      get() {
        return this.$store.state.user.changeschoolid
      }
    }
  },
  methods: {
    editvisible() {
      this.eidtDialogFormVisible = false
    },
    init(item, unitGuid) {
      console.log(item)
      this.roomGuid = item.roomGuid
      this.eidtDialogFormVisible = true
      this.unitGuid = unitGuid
      console.log(item)
      // 设备id
      // this.editdataForm.terminalGuid = item.terminalGuid;
      this.editdataForm.terminalCode = item.terminalCode
      this.editdataForm.nameListType = item.nameListType
      this.editdataForm.terminalName = item.terminalName
      this.editdataForm.terminalGuid = item.terminalGuid
      this.editdataForm.devicemodel = item.modelId
      this.editdataForm.mac = item.mac
      this.editdataForm.deviceisuse = item.isUse == 1 ? true : false
      if (item.modelId == 45) {
        this.nameListOption = [
          { value: 1, label: '16字节' },
          { value: 2, label: '32字节' }
        ]
      } else if (item.modelId == 46 || item.modelId == 49) {
        this.nameListOption = [{ value: 1, label: '16字节' }]
      } else if (
        item.modelId == 47 ||
        item.modelId == 48 ||
        item.modelId == 43
      ) {
        this.nameListOption = [{ value: 2, label: '32字节' }]
      }
      this.terminalselect()
    },
    closeDialog(done) {
      this.$refs['editdataForm'].resetFields()
      done()
    },
    //设备型号选项
    terminalselect() {
      this.terminaloption = []
      console.log(this.unitGuid)
      this.$http({
        url: this.$http.adornUrl('/terminal/terminal-model-select'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            terminalType: 22,
            unitGuid: this.unitGuid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        console.log(data)
        if (data.messageCode == 200) {
          let Arr = data.messageContent
          if (this.terminaloption.length == 0) {
            for (var i = 0; i < Arr.length; i++) {
              var itemObj = {
                label: Arr[i].modelName,
                value: Arr[i].modelId
              }
              this.terminaloption.push(itemObj)
            }
          }
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    //修改设备型号
    editdataFormSubmit() {
      if (this.editdataForm.nameListType == '') {
        this.$message({
          message: '名单格式不能为空',
          type: 'warning'
        })
        return
      }
      if (this.editdataForm.mac != '') {
        let arr = this.editdataForm.mac.split('')
        let is = false
        let test = /^[0-9a-fA-F]$/
        arr.some(item => {
          if (!test.test(item)) {
            is = true
          }
        })
        if (is) {
          this.$message({
            message: '序列号的每个字符都必须在0-9或a-f范围内',
            type: 'warning'
          })
          return
        }
      }
      this.$http({
        url: this.$http.adornUrl('/area/room/update-room-terminal-model'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            isUse: this.editdataForm.deviceisuse == true ? 1 : 0,
            unitGuid: this.unitGuid,
            terminalModel: this.editdataForm.devicemodel,
            terminalGuid: this.editdataForm.terminalGuid,
            nameListType: this.editdataForm.nameListType,
            mac: this.editdataForm.mac
          },
          messageType: 0
        })
      }).then(({ data }) => {
        console.log(data)
        if (data.messageCode == 200) {
          this.$message({
            type: 'success',
            message: '修改成功',
            duration: 200,
            onClose: () => {
              this.$emit('refreshDataList', this.buttonindex + 1)
              this.eidtDialogFormVisible = false
            }
          })
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    //修改中继
    relayinit(item, unitGuid, buildingid) {
      this.roomGuidList = []
      console.log(item)
      this.roomGuidList.push(item.roomGuid)
      this.buildingGuid = buildingid
      this.repeaterdataForm.controllerGuid = item.controllerGuid
      this.unitGuid = unitGuid
      this.repeaterdataForm.terminalGuid = item.terminalGuid
      this.repeaterdataForm.repeater1 = item.repeaterGuid1
      this.repeaterdataForm.repeater2 = item.repeaterGuid2
      this.repeaterdataForm.repeater3 = item.repeaterGuid3
      this.repeaterdataForm.repeater4 = item.repeaterGuid4
      this.repeaterlist()
      this.repeaterDialogFormVisible = true
    },
    repeatercloseDialog(done) {
      this.$refs['repeaterdataForm'].resetFields()
      done()
    },
    repeatervisible() {
      this.$refs['repeaterdataForm'].resetFields()
      this.repeaterDialogFormVisible = false
    },
    repeaterdataFormSubmit() {
      this.$http({
        url: this.$http.adornUrl('/terminal/bind-terminal-room-repeater'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            repeater1: this.repeaterdataForm.repeater1,
            repeater2: this.repeaterdataForm.repeater2,
            repeater3: this.repeaterdataForm.repeater3,
            repeater4: this.repeaterdataForm.repeater4,
            roomGuidList: this.roomGuidList,
            terminalType: 22
          },
          messageType: 0
        })
      }).then(({ data }) => {
        if (data.messageCode == 200) {
          this.$message({
            type: 'success',
            message: '修改成功!',
            duration: 200,
            onClose: () => {
              this.$emit('refreshDataList', this.buttonindex + 1)
              this.repeaterDialogFormVisible = false
            }
          })
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    repeaterlist() {
      this.repeateroption = []
      this.$http({
        url: this.$http.adornUrl('/terminal/terminal-repeater-list'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            buildingGuid: this.buildingGuid,
            controllerGuid: this.repeaterdataForm.controllerGuid,
            terminalGuid: this.repeaterdataForm.terminalGuid,
            unitGuid: this.unitGuid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        if (data.messageCode == 200) {
          let Arr = data.messageContent
          if (Arr) {
            for (var i = 0; i < Arr.length; i++) {
              var itemObj = {
                label: Arr[i].terminalName,
                value: Arr[i].terminalGuid
              }
              this.repeateroption.push(itemObj)
            }
          }
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    repeaterslect() {
      if (this.repeaterdataForm.repeater1 == this.repeaterdataForm.repeater2) {
        this.$message({
          message: '当前选择与第二心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater1 = ''
        return
      }
      if (this.repeaterdataForm.repeater1 == this.repeaterdataForm.repeater3) {
        this.$message({
          message: '当前选择与第三心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater1 = ''
        return
      }
      if (this.repeaterdataForm.repeater1 == this.repeaterdataForm.repeater4) {
        this.$message({
          message: '当前选择与第四心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater1 = ''
        return
      }
    },
    repeaterslect2() {
      if (this.repeaterdataForm.repeater2 == this.repeaterdataForm.repeater1) {
        this.$message({
          message: '当前选择与第一心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater2 = ''
        return
      }
      if (this.repeaterdataForm.repeater2 == this.repeaterdataForm.repeater3) {
        this.$message({
          message: '当前选择与第三心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater2 = ''
        return
      }
      if (this.repeaterdataForm.repeater2 == this.repeaterdataForm.repeater4) {
        this.$message({
          message: '当前选择与第四心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater2 = ''
        return
      }
    },
    repeaterslect3() {
      if (this.repeaterdataForm.repeater3 == this.repeaterdataForm.repeater1) {
        this.$message({
          message: '当前选择与第一心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater3 = ''
        return
      }
      if (this.repeaterdataForm.repeater3 == this.repeaterdataForm.repeater2) {
        this.$message({
          message: '当前选择与第二心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater3 = ''
        return
      }
      if (this.repeaterdataForm.repeater3 == this.repeaterdataForm.repeater4) {
        this.$message({
          message: '当前选择与第四心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater3 = ''
        return
      }
    },
    repeaterslect4() {
      if (this.repeaterdataForm.repeater4 == this.repeaterdataForm.repeater1) {
        this.$message({
          message: '当前选择与第一心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater4 = ''
        return
      }
      if (this.repeaterdataForm.repeater4 == this.repeaterdataForm.repeater2) {
        this.$message({
          message: '当前选择与第二心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater4 = ''
        return
      }
      if (this.repeaterdataForm.repeater4 == this.repeaterdataForm.repeater3) {
        this.$message({
          message: '当前选择与第三心跳中继冲突',
          type: 'warning'
        })
        this.repeaterdataForm.repeater4 = ''
        return
      }
    },
    //参数模板修改
    parameterinit(item, unitGuid) {
      this.roomGuidList = []
      console.log(item)
      this.roomGuidList.push(item.roomGuid)
      this.unitGuid = unitGuid
      this.parameterdataForm.template = item.templateGuid
      this.terminaltemplate()
      this.parameterDialogFormVisible = true
    },
    parametercloseDialog(done) {
      this.$refs['parameterdataForm'].resetFields()
      done()
    },
    parametervisible() {
      this.$refs['parameterdataForm'].resetFields()
      this.parameterDialogFormVisible = false
    },
    //获取设备模板
    terminaltemplate() {
      this.$http({
        url: this.$http.adornUrl('/terminal/template-model-select'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            terminalType: 22,
            unitGuid: this.unitGuid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        console.log(data)
        if (data.messageCode == 200) {
          let Arr = data.messageContent
          if (this.templateoption.length == 0) {
            for (var i = 0; i < Arr.length; i++) {
              var itemObj = {
                label: Arr[i].templateName,
                value: Arr[i].templateGuid
              }
              this.templateoption.push(itemObj)
            }
          }
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    //修改房间参数模板
    parameterdataFormSubmit() {
      this.$http({
        url: this.$http.adornUrl('/terminal/room-terminal-template-update'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            roomGuidList: this.roomGuidList,
            unitGuid: this.unitGuid,
            templateGuid: this.parameterdataForm.template,
            terminalType: 22
          },
          messageType: 0
        })
      }).then(({ data }) => {
        console.log(data)
        if (data.messageCode == 200) {
          this.$message({
            type: 'success',
            message: '修改成功!',
            duration: 200,
            onClose: () => {
              this.$emit('refreshDataList')
              this.parameterDialogFormVisible = false
            }
          })
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    // 房间人员管理修改
    personnelinit(item, unitGuid, buildingid) {
      this.roomGuid = item.roomGuid
      console.log(item, unitGuid, buildingid)
      this.personnelFormVisible = true
      this.operatinincomesummaryofconsmptionVisible = true
    },
    personnelcloseDialog(done) {
      this.personnelFormVisible = false
      this.operatinincomesummaryofconsmptionVisible = false
      done()
    },
    personnelvisible() {
      this.personnelFormVisible = false
      this.operatinincomesummaryofconsmptionVisible = false
    },
    baocun() {
      console.log('baocun')
      this.personnelFormVisible = false
      this.$refs.operatinincomesummaryofconsumption.childClick()
      this.operatinincomesummaryofconsmptionVisible = false
    },
    // 通行记录
    // 父组件调用此函数，传值
    recordsinit(item, unitGuid, buildingid, treedata) {
      this.roomGuid = item.roomGuid
      this.recordsFormVisible = true
      this.recordsdetailsVisible = true
    },
    // 关闭窗口
    recordscloseDialog(done) {
      done()
      this.recordsdetailsVisible = false
    },
    // 关闭窗口
    recordsvisible() {
      this.recordsFormVisible = false
      this.recordsdetails = false
      // 控制子节点
      this.recordsdetailsVisible = false
    },
    // 保存
    records() {},

    /*
      时效密码
    */
    // 父组件调用此函数，传值
    passinit(item, unitGuid, buildingid, treedata) {
      console.log(item)
      this.roomGuid = item.roomGuid
      this.passterdataForm.terminalGuid = item.terminalGuid
      console.log(this.passterdataForm.terminalGuid)
      this.passFormVisible = true
      this.passdetailsVisible = true
    },
    // 关闭窗口
    passcloseDialog(done) {
      done()
      this.passdetailsVisible = false
    },
    // 关闭窗口
    passvisible() {
      this.passFormVisible = false
      this.passdetails = false
      // 控制子节点
      this.passdetailsVisible = false
    },

    passbaocun() {
      this.$refs.passdetailsRef.preservation()
      this.passFormVisible = false
      this.passdetails = false
      // 控制子节点
      this.passdetailsVisible = false
    }
  },
  components: {
    OperatinIncomeSummaryOfConsumption,
    RecordsDetails,
    PasswordDetails
  }
}
</script>

<style lang="scss" scoped>
.logTable {
  /deep/.el-dialog--center .el-dialog__body {
    padding: 0 20px;
  }
}
</style>
